
var id;
var applicationName = [];
var phone = [];
var reason = [];
var address = [];
var state = [];

var body = $('body');


$(function () {
    $("[data-toggle='popover']").popover();
});

//此处需要优化UI显示 对齐问题
body.on('click', '.detail', function() {

    id =  $(this).parent().parent().children().eq(0).text();
    var myLargeModalLabel = $("#myLargeModalLabel");
    myLargeModalLabel.text(applicationName[id]+"的申请表");
    var $detailInfo = $("#detailInfo");
    var $footer = $("#footer");
    $detailInfo.empty();
    $footer.empty();
    $detailInfo.append("<h4>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;ID：&nbsp;&nbsp;"+ id +"</h4><br/>");
    $detailInfo.append("<h4 >&nbsp;&nbsp;姓名：&nbsp;&nbsp;"+ applicationName[id] +"</h4><br/>");
    $detailInfo.append("<h4 >手机号：&nbsp;&nbsp;"+ phone[id] +"</h4><br/>");
    $detailInfo.append("<h4 >&nbsp;地址：&nbsp;&nbsp;"+ address[id] +"</h4><br/>");
    $detailInfo.append("<h4 >申请理由:</h4><br/>");
    $detailInfo.append("<textarea class='form-control' disabled='disabled' rows='6' style='font-size: larger'>"+ reason[id] +"</textarea>");

    if(state[id]==="申请中"){
        $footer.append("<button type=\"button\" class=\"btn btn-default btn-round\" data-dismiss=\"modal\">关闭</button>");
        $footer.append("<button type=\"button\" class='btn btn-danger btn-round' id=\"eliminate\" data-toggle='modal' >淘汰</button>");
        $footer.append("<button type=\"button\" class='btn btn-cyan btn-round' id=\"pass\" data-toggle='modal'>录用</button>");
    }else {
        $footer.append("<button type=\"button\"  class=\"btn btn-default btn-round\" data-dismiss=\"modal\">关闭</button>");
    }






});

body.on('click', '#pass', function(){
    //console.log("pass");
    $("#pass").attr("disabled","disabled");
    $.ajax({
        type:'get',
        url:'passApplication',
        data:{
            'id':id,
            'name':applicationName[id],
            'phone':phone[id],
            'address':address[id]
        },
        success:function () {
            $("#eliminate").remove();
            $("#table").bootstrapTable('refresh');
        }

    })
});

body.on('click', '#eliminate', function(){

    $("#eliminate").attr("disabled","disabled");
    $.ajax({
        type: 'get',
        url: 'eliminateApplication',
        data:{
            'id':id
        },
        success:function () {
            $("#table").bootstrapTable('refresh');
        }
    })
});

    $('#table').bootstrapTable({
        classes: 'table table-bordered table-hover table-striped',
        url: 'getVolunteerList',
        method: 'get',
        contentType:'application/json',
        dataType : 'json',        // 因为本示例中是跨域的调用,所以涉及到ajax都采用jsonp,
        uniqueId: 'applicationId',
        cache:'false',
        idField: 'applicationId',             // 每行的唯一标识字段
        toolbar: '#toolbar',       // 工具按钮容器
        clickToSelect: true,     // 是否启用点击选中行
        showColumns: true,         // 是否显示所有的列
        showRefresh: true,         // 是否显示刷新按钮
        showSearchClearButton:true,
        //showToggle: true,        // 是否显示详细视图和列表视图的切换按钮(clickToSelect同时设置为true时点击会报错)

        pagination: true,                    // 是否显示分页
        sortOrder: "asc",                    // 排序方式
        // 传递参数
        sidePagination: "client",            // 分页方式：client客户端分页，server服务端分页
        pageNumber: 1,                       // 初始化加载第一页，默认第一页
        pageSize: 15,                        // 每页的记录行数     // 可供选择的每页的行数
        search: true,                      // 是否显示表格搜索，此搜索是客户端搜索

        //showExport: true,        // 是否显示导出按钮, 导出功能需要导出插件支持(tableexport.min.js)
        //exportDataType: "basic", // 导出数据类型, 'basic':当前页, 'all':所有数据, 'selected':选中的数据

        columns: [{
            field: 'applicationId',
            title: '申请人ID',
            sortable: true  // 是否排序

        }, {
            field: 'applicationName',
            title: '姓名'
        }, {
            field: 'applicationPhone',
            title: '手机号'
        }, {
            field: 'applicationAddress',
            title: '地址',
            formatter:function(value){
                if(value.length>=5){
                    var add = value.substring(0,8);
                    return add +"...";
                }else {
                    return value;
                }
            }
        }, {
            field: 'applicationName',
            title: '申请理由',
            formatter:function(value){
                if(value.length>=5){
                    var add = value.substring(0,5);
                    return add +"...";
                }else {
                    return value;
                }
            }
        }, {
            field: 'applicationState',
            title: '申请状态',
            formatter:function (value) {
                if(value==="申请中"){
                    return "<h4><span class='label label-primary'>申请中</span></h4>";
                }else if(value==="申请失败"){
                    return "<h4><span class='label label-danger'>申请失败</span></h4>";
                }else if(value==="申请成功"){
                    return "<h4><span class='label label-success'>申请成功</span></h4>";
                }
            }
        },{
            field: 'operate',
            title: '操作',
            formatter:function (value,item) {
                //console.log(item);
                applicationName[item.applicationId] = item.applicationName;
                phone[item.applicationId] = item.applicationPhone;
                reason[item.applicationId] = item.applicationReason;
                address[item.applicationId] = item.applicationAddress;
                state[item.applicationId] = item.applicationState;
                return "<button class='btn btn-info btn-sm detail' data-toggle='modal' data-target='#detailModal'>详细信息</button>";
            }
        }],
        onLoadSuccess: function(data){
            $("[data-toggle='tooltip']").tooltip();
        }
    });
